<!DOCTYPE html>
<html lang="zh-cn">
<head>
<meta charset=utf-8>
<title>编辑</title>
<meta name="viewport" content="">
<style type="text/css">
*{margin:0;padding:0}
body{padding:3%;border:2px solid #dcd2b0}
.main{width:100%;height:100%;}
.left{width:60%;height:100%;float:left;}
.zipcode{width:100%;height:10%;}
.zipcode ul{width:100%;height:100%;}
.zipcode ul li{display:inline-block;width:10%;height:90%;border:2px solid #EFECDD;font-size:26px;text-align:center;color:#D0C8B3;}
.send_info{width:100%;height:50%;margin:8% 0 0;}
.helvetica{color:#CB6F4A;font-family:Helvetica;}
.send_user{width:100%;height:22%;font-size:26px;}
.send_user .add_user{color:#afa480;font-family:AdobeHeitiStd;border-bottom:1px solid;}
.send_word{width:100%;height:80%}
.send_word div{border-bottom:2px solid #dcd2b0;width:100%;height:18%;font-size:26px;color:#dad5c5;font-family:AdobeHeitiStd;padding:2% 1% 0;}
.send_from{margin-top:12%;}
.right{width:40%;height:100%;display:inline-block;float:left;}
.mark_stamp{width:100%;height:35%;}
.mark_stamp .mark{width:35%;height:65%;vertical-align:middle;margin:0 4% 0 12%;}
.mark_stamp .stamp{height:80%;vertical-align:middle;}
.send_address{height:35%;width:80%;border-left:2px dotted #dcd2b0;margin-left:8%;padding-left:8%;}
.send_address div{border-bottom:2px solid #dcd2b0;width:100%;height:21%;font-size:26px;color:#dad5c5;font-family:AdobeHeitiStd;padding:2% 1% 0;}
.hand_write{width:100%;height:30%;margin-left:12%}
.hand_write img{border:2px solid #dcd2b0;width:90%;height:100%;}
.send_location{height:100%;width:100%;}
.send_location img{height:80%;width:5%;margin-left:5px;}
</style>
</head>
<body>
<script>
function getParameter(url, name) {
	var r=new RegExp("(\\?|#|&)"+name+"=([^&]*)(&|$)")
	var m=url.match(r);
	if(!m||m=="")m=url.match(r)
	return(!m?"":m[2]);
}
var body_width = getParameter(location.href,"width"), 
	body_height = getParameter(location.href,"height");

if(body_width < body_height){
	var temp = body_width;
	body_width = body_height;
	body_height = temp;
}
document.body.style.width = (body_width - 4) + "px";
document.body.style.height = (body_height - 4) + "px";
</script>
<div class="main">
	<div class="left">
		<div class="zipcode">
			<ul>
				<li>&nbsp;</li>
				<li>&nbsp;</li>
				<li>&nbsp;</li>
				<li>&nbsp;</li>
				<li>&nbsp;</li>
				<li>&nbsp;</li>
			</ul>
		</div>
		<div class="send_info">
			<div class="send_user">
				<span class="helvetica">TO:</span>
				<span class="add_user">添加收件人;</span>
			</div>
			<div class="send_word">
				<div>在此处写上您的祝福！</div>
				<div></div>
				<div></div>
				<div></div>
			</div>
		</div>
		<div class="send_info send_from">
			<div class="send_user">
				<span class="helvetica">FROM:</span>
				<span class="add_user">添加发件人;</span>
			</div>
			<div class="send_word">
				<div class="send_location">自动获取您所在的地址<span><img src="position.png"/></span></div>
			</div>
		</div>
	</div>
	<div class="right">
		<div class="mark_stamp">
			<img class="mark" src="postmark.png" alt=""/>
			<img class="stamp" src="stamp.png" alt=""/>
		</div>
		<div class="send_address">
			<div>收件人地址</div>
			<div></div>
			<div></div>
		</div>
		<div class="hand_write">
			<img src="handwrt.png" alt=""/>
		</div>
	</div>
</div>


<script>
	var MingEdit = (function(){
		function init(){
			var fontSize = Math.floor(body_height*0.4*0.18*0.752);
			if(fontSize > 0){
				var fontEmt = document.querySelectorAll(".send_word div, .zipcode li, .send_user, .send_address div");
				for(var i = 0, len = fontEmt.length; i < len; i++){
					fontEmt[i].style.fontSize = fontSize  + "px";
				}
			}
		}
		return {
			init : init
		};
	})();
	
	
	window.onload = function(){
		MingEdit.init();	
	}
</script>
</body>
</html>
